<!DOCTYPE html>
<html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
    <title>index</title>
    <script src="/static/js/jquery-1.11.3.min.js" type="text/javascript"></script>


    <style type="text/css">
        #choose input {
            display: block;
        }
    </style>


    <script type="text/javascript">
        $(function () {
            var $choose = $("#choose input");
            //全选
            $("#all").click(function () {
                $choose.each(function () {
                    $(this).prop("checked", true);
                });
            });
            //全不选
            $("#not").click(function () {
                $choose.prop("checked", false);
            });
            //反选
            $("#reverse").click(function () {
                $choose.each(function () {
                    $(this).prop("checked", !$(this).prop("checked"));
                });
            });
        });
    </script>
</head>
<body>
<div id="box-function">
    <input id="all" type="button" value="全选2"/>
    <input id="not" type="button" value="全不选2"/>
    <input id="reverse" type="button" value="反选2"/>
</div>

<div class="demo1" id="choose">
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
    <input type="checkbox"/>
</div>
</body>


</html>